<template>
  <el-dialog title="活动订单" :visible.sync="showActivityOrderDialog" center >
    <el-carousel indicator-position="outside" :autoplay="false" height="600px">
      <el-carousel-item>
        <div class="item">

          <h4>成交额: {{orderData.total}}</h4>
          <h4>订单数: {{orderData.ordtotal}}</h4>
          <h4>报名课程: {{orderData.courseCount}}</h4>
          <h4>赠送课程: {{orderData.sendCourse}}</h4>
<!--          <div>-->
<!--            <img class="course-img" :src="item.image" alt="暂无图片">-->
<!--          </div>-->
          <el-tabs class="tab">
            <el-tab-pane label="拼团中" name="first">拼团中</el-tab-pane>
            <el-tab-pane label="批团完成" name="second">拼团完成</el-tab-pane>
            <el-tab-pane label="拼团失败" name="third">拼团失败</el-tab-pane>
          </el-tabs>

        </div>
      </el-carousel-item>
    </el-carousel>
  </el-dialog>
</template>

<script>
  import {getActivityOrder} from '@/api/thk/activity'
  import store from '@/store'
  export default {
    name: 'activityOrder',
    data(){
      return{
        showActivityOrderDialog: false,
        orderData: []
      }
    },

    methods:{
      showActiveOrder(activity_id){
        this.showActivityOrderDialog = !this.showActivityOrderDialog
        const data={
          activity_id:activity_id
        }
        console.log(store.getters.token,data)
        getActivityOrder(store.getters.token, data).then(res => {
          this.orderData = res.data
          console.log(this.orderData,"获取了活动订单")
        }).catch(err => {
          this.$message('获取活动订单失败')
          console.log(err)
        })
      }
    }
  }
</script>

<style scoped>
  .item{
    text-align: center;
  }
  .tab{
    text-align: center;
    margin: 0 auto;
  }
</style>

